<!--  -->
<template>
  <div>
     <el-table
    :data="tableData"
    stripe
    style="width: 100%">

      <el-table-column
      type="index"
      :index="indexMethod"
   >
    </el-table-column> 
    <el-table-column
      prop="篇名"
      label="篇名"
      width="300"
    >
       <template slot-scope="scope">
       <router-link  :to="{path:'/detail',query:{index:scope.row.index,id:scope.row.id}}">
         <p v-html="scope.row.篇名"></p>
        </router-link> 
      </template>
    </el-table-column>
    <el-table-column
      prop="作者"
      label="作者"
      width="180">
    </el-table-column>

    <el-table-column
      prop="中文刊名"
      label="刊名"
      width="180">
    
         <template slot-scope="scope">
       <router-link  :to="{path:'/Scholardetails', query:{pykm:scope.row.拼音刊名}}">
            {{scope.row.中文刊名}}
        </router-link> 
      </template>
    </el-table-column>
    <el-table-column
      prop="出版日期"
      label="出版日期">
    </el-table-column>
     <el-table-column
      prop="address"
      label="操作">
       <template slot-scope="scope">
       
       <i class="down" title="下载" @click="down(scope.row)"></i>
       <i class="read" title="在线预览"  @click="read(scope.row)"></i>
      </template>
    </el-table-column>
  </el-table>
    <onlinereades ref="onlinereadref"   />
  </div>
</template>

<script>
import onlinereades  from '@/views/common/onlinereades.vue'
export default {
  name:'',
  components: {onlinereades},
  props:['tableData','page','pageSize'],
  data() {
      return {
  
        }
        },
  computed: {},
  watch: {},
  created() {},
  mounted(){},
  methods: {
    indexMethod(index) {
        return (this.page-1)*this.pageSize+index+1;
      },
        down(row) {
      window.location.href ="http://localhost:8990/ng/es/download?filename="+ row.文件名+"&year="+row.年+"&qi="+row.期
      +"&zjdm="+row.专辑代码 +"&gph="+row.光盘号 +"&pykm="+row.拼音刊名 +"&title="+row.篇名

  },
   read(row){
     this.$refs.onlinereadref.onlinereadProgress(row)
  }

  }
}

</script>
<style lang='css' scoped>
.down {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(../../assets/img/kns8-icon-sprite.png);
    background-repeat: no-repeat;
    background-position: 0px -140px;
    float: left;
    cursor: pointer;
}
.read {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(../../assets/img/kns8-icon-sprite.png);
    background-repeat: no-repeat;
    background-position: -20px -140px;
     float: left;
     cursor: pointer;
}
.cell a{

  cursor: pointer;
}
 a:focus, a:hover {
    color: rgb(76, 122, 179);
    text-decoration: none;
}
</style>